<template>
  <view class="container">
    <scroll-view scroll-y="true" style="width: 100%; height: 100vh">
      <!-- 手机号 -->
      <view class="phone">
        <view>
          联系方式
          <text style="color: #ff0000">*</text>
        </view>
        <input type="text" placeholder="请输入联系方式" v-model="mobile" style="text-align: right" />
      </view>
      <!-- 上传正面身份证 -->
      <view class="cardfront">
        <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          上传身份证人像面
          <text style="color: red">*</text>
        </view>
        <image :src="imgUrl + card_front" mode="aspectFill" v-if="card_front != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></image>
        <image src="../../static/icon/userfront.png" v-else mode="aspectFill" style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(1)"></image>
      </view>
      <!-- 上传反面身份证  -->
      <view class="cardfront">
        <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          上传身份证国徽面
          <text style="color: red">*</text>
        </view>
        <image :src="imgUrl + card_side" mode="aspectFill" v-if="card_side != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></image>
        <image src="../../static/icon/userback.png" mode="aspectFill" v-else style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(2)"></image>
      </view>
      <!-- 姓名 -->
      <view class="phone">
        <view>
          姓名
          <text style="color: #ff0000">*</text>
        </view>
        <input type="text" placeholder="请输入姓名" v-model="name" style="text-align: right" />
      </view>
      <!-- 性别 -->
      <view class="phone" @click="$refs.gender.open()">
        <view>
          性别
          <text style="color: #ff0000">*</text>
        </view>
        <view style="display: flex; align-items: center">
          <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500; color: #999999">{{ gendername != '' ? gendername : '请选择' }}</view>
          <uni-icons type="right" size="20" color="#888888"></uni-icons>
        </view>
      </view>
      <!-- 身份证号 -->
      <view class="phone">
        <view>
          身份证号
          <text style="color: #ff0000">*</text>
        </view>
        <input type="text" placeholder="请输入" v-model="card_num" style="text-align: right" />
      </view>
      <!-- 身份选择 -->
      <view class="phone" @click="$refs.sf.open()">
        <view>
          身份选择
          <text style="color: #ff0000">*</text>
        </view>
        <view style="display: flex; align-items: center">
          <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500; color: #999999">{{ sfname != '' ? sfname : '请选择' }}</view>
          <uni-icons type="right" size="20" color="#888888"></uni-icons>
        </view>
      </view>
      <!-- 上传毕业证 -->
      <view class="cardfront">
        <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          大学录取证明/学生证
          <text style="color: red">*</text>
        </view>
        <image :src="imgUrl + diploma" mode="aspectFill" v-if="diploma != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></image>
        <image src="../../static/icon/biyezheng.png" v-else mode="aspectFill" style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(3)"></image>
      </view>
      <!-- 上传毕业证 -->
      <view class="cardfront">
        <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          上传教师资格证/大学录取证明
          <text style="color: red" v-if="sfindex == 0">*</text>
        </view>
        <image :src="imgUrl + certification" mode="aspectFill" v-if="certification != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></image>
        <image src="../../static/icon/jiaozi.png" v-else mode="aspectFill" style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(4)"></image>
      </view>
      <!-- 教龄 -->
      <view class="phone">
        <view>
          教龄
          <text style="color: #ff0000">*</text>
        </view>
        <input type="number" v-model="teaching_len" placeholder="请填写教学年龄" style="text-align: right" />
      </view>
      <!--  请选择主教科目 -->
      <view class="phone" @click="$refs.mainsubject.open()">
        <view>
          请选择主教科目
          <text style="color: #ff0000">*</text>
        </view>
        <view style="display: flex; align-items: center">
          <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500; color: #999999">{{ miansubjectname != '' ? miansubjectname : '请选择' }}</view>
          <uni-icons type="right" size="20" color="#888888"></uni-icons>
        </view>
      </view>
      <!--   请选择主教年级 -->
      <view class="phone" @click="$refs.mainsubjectgrade.open()">
        <view>
          请选择主教年级
          <text style="color: #ff0000">*</text>
        </view>
        <view style="display: flex; align-items: center">
          <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500; color: #999999">{{ maingradename != '' ? maingradename : '请选择' }}</view>
          <uni-icons type="right" size="20" color="#888888"></uni-icons>
        </view>
      </view>

      <!-- 请选择辅教科目 -->
      <view class="phone" v-if="showfujiao" @click="$refs.fujiaokemu.open()">
        <view>
          请选择辅教科目
          <text style="color: #ff0000">*</text>
        </view>
        <view style="display: flex; align-items: center">
          <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500; color: #999999">{{ fusubjectname != '' ? fusubjectname : '请选择' }}</view>
          <uni-icons type="right" size="20" color="#888888"></uni-icons>
        </view>
      </view>
      <!-- 请选择辅教年级 -->
      <view class="phone" v-if="showfujiao" @click="$refs.fujiaonianji.open()">
        <view>
          请选择辅教年级
          <text style="color: #ff0000">*</text>
        </view>
        <view style="display: flex; align-items: center">
          <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500; color: #999999">{{ fugradename != '' ? fugradename : '请选择' }}</view>
          <uni-icons type="right" size="20" color="#888888"></uni-icons>
        </view>
      </view>
      <!-- 展开辅教科目 -->
      <view class="swichfujiao" @click="showfujiao = true" v-if="!showfujiao">+添加辅教课目</view>
      <!-- 个人地址 -->
      <view class="phone">
        <view>
          个人地址
          <text style="color: #ff0000">*</text>
        </view>
        <input type="text" placeholder="例如:河南省郑州市金水区未来路181号" v-model="address" @blur="getlat" style="text-align: right; width: 500rpx" />
      </view>
      <!-- 请填写教学经历 -->
      <view style="box-sizing: border-box; :28rpx ; font-family: PingFang SC, PingFang SC; font-weight: 500; padding: 40rpx">
        请填写教学经历
        <text style="color: red">*</text>
      </view>
      <!-- 教学经历 -->
      <view class="experience" v-for="(item, index) in teaching" :key="index">
        <!-- 时间 -->
        <view class="time">
          <!--  <view class="starttime">{{ item.teaching_start ? item.teaching_start : '请选择开始时间' }}</view> -->
          <picker mode="date" :value="item.teaching_start" :start="startDate" :end="endDate" @change="bindDateChange($event, index)">
            <view class="uni-input starttime">{{ item.teaching_start ? item.teaching_start : '请选择开始时间' }}</view>
          </picker>
          <view>——</view>
          <picker mode="date" :value="item.teaching_end" :start="startDate" :end="endDate" @change="bindDateChangeend($event, index)">
            <view class="uni-input endtime">{{ item.teaching_end ? item.teaching_end : '请选择结束时间' }}</view>
          </picker>
        </view>
        <!-- 标题 -->
        <view class="title">
          <view class="titlebox">
            <view style="font-weight: 500; font-size: 24rpx; color: #333333">标题</view>
            <input
              type="text"
              placeholder="标题20字以内"
              v-model="item.teaching_title"
              style="width: 450rpx; text-align: right; font-weight: 500; font-size: 24rpx; color: #999999"
            />
          </view>
        </view>
        <!-- 内容 -->
        <view style="position: relative">
          <textarea maxlength="200" class="content" placeholder="请输入教学经历" v-model="item.teaching_career"></textarea>
          <view style="position: absolute; bottom: 60rpx; right: 40rpx; font-size: 22rpx">{{ item.teaching_career.length }}/200</view>
          <view style="box-sizing: border-box; font-size: 22rpx; display: flex; justify-content: flex-end; margin-top: 20rpx; color: red" @click="delexperence(index)">
            删除此经历
          </view>
        </view>
      </view>
      <!-- 添加教学经历 -->
      <view
        class="swichfujiao"
        @click="
          teaching.push({
            teaching_start: '',
            teaching_end: '',
            teaching_title: '',
            teaching_career: ''
          })
        "
      >
        +添加教学经历
      </view>

      <!-- 成功案例 -->
      <view style="box-sizing: border-box; :28rpx ; font-family: PingFang SC, PingFang SC; font-weight: 500; padding: 40rpx">
        提分案例
        <text style="color: red">*</text>
      </view>
      <!--标题 -->
      <view class="oktitle">
        <view style="font-weight: 500; font-size: 24rpx; color: #333333">标题</view>
        <input type="text" placeholder="标题20字以内" v-model="case_title" style="width: 450rpx; text-align: right; font-weight: 500; font-size: 24rpx; color: #999999" />
      </view>
      <!-- 成功案例内容 -->
      <view style="position: relative">
        <textarea maxlength="200" class="content2" v-model="case_content" placeholder="请填写成功案例"></textarea>
        <view style="position: absolute; bottom: 20rpx; right: 80rpx; font-size: 22rpx">{{ case_content.length }}/200</view>
      </view>
      <!--  奖励荣誉 -->
      <view style="box-sizing: border-box; :28rpx ; font-family: PingFang SC, PingFang SC; font-weight: 500; padding: 40rpx">
        请填写奖励荣誉
        <text style="color: red">*</text>
        <!-- 荣誉奖励内容 -->
        <view style="position: relative">
          <textarea maxlength="200" class="rongyu" v-model="honors" placeholder="请输入荣誉奖励"></textarea>
          <view style="position: absolute; bottom: 20rpx; right: 80rpx; font-size: 22rpx">{{ honors.length }}/200</view>
        </view>
      </view>
      <view></view>
      <!--职称、上传职称证-->
      <view class="cardfront">
        <!--  <view style="display: flex; align-items: center; justify-content: space-between; font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          <view>职称</view>
          <input type="text" placeholder="请输入职称" v-model="duty_name" :adjust-position="false" style="text-align: right" />
        </view> -->
        <image :src="imgUrl + duty_pic" mode="aspectFill" v-if="duty_pic != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></image>
        <image src="../../static/icon/zhicheng.png" v-else mode="aspectFill" style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(5)"></image>
      </view>
      <!-- 个人照片 -->
      <view class="cardfront">
        <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          个人照片
          <text style="color: red">*</text>
        </view>
        <image :src="imgUrl + person_pic" mode="aspectFill" v-if="person_pic != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></image>
        <image v-else src="../../static/icon/avatar.png" mode="aspectFill" style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(6)"></image>
      </view>
      <!-- 个人视频 -->
      <view class="cardfront">
        <view style="font-size: 28rpx; font-family: PingFang SC, PingFang SC; font-weight: 500">
          个人视频

          <!-- <text style="color: red">*</text> -->
          <text style="font-weight: 500; font-size: 24rpx; color: #999999">(个人视频上传要求)</text>
        </view>
        <video :src="imgUrl + video" v-if="video != ''" style="width: 240rpx; height: 160rpx; margin-top: 30rpx"></video>
        <image src="../../static/icon/uservideo.png" v-else mode="aspectFill" style="width: 240rpx; height: 160rpx; margin-top: 30rpx" @click="upload(7)"></image>
      </view>
      <!-- 同意协议单选框 -->
      <view style="box-sizing: border-box; padding: 0 40rpx; font-weight: 500; font-size: 24rpx; background-color: #fff">
        <label class="radio">
          <radio :checked="agree" @click="agree = !agree" style="transform: scale(0.7)" color="#3553E8" />
          我已同意
          <text style="color: #3553e8" @click.stop="gojiedanxy">《教师接单协议》</text>
          和
          <text style="color: #3553e8" @click.stop="goruzhuxy">《教师入住协议》</text>
        </label>
      </view>

      <!-- 提交按钮 -->
      <view class="submit" @click="rzteacher">提交</view>
    </scroll-view>
    <!-- 主教科目选择 -->
    <uni-popup ref="mainsubject" type="bottom">
      <view class="genderbox">
        <view class="boxheader">
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #030303" @click="$refs.mainsubject.close()">取消</view>
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #3553e8" @click="minsubjectok">完成</view>
        </view>
        <picker-view indicator-style="height: 50px;" style="height: 400rpx" :value="value" @change="mainsubject">
          <picker-view-column>
            <view v-for="(item, index) in mainsubjectlist" :key="index" style="text-align: center; line-height: 100rpx">
              {{ item.name }}
            </view>
          </picker-view-column>
        </picker-view>
      </view>
    </uni-popup>
    <!-- 主教年级选择 -->
    <uni-popup ref="mainsubjectgrade" type="bottom">
      <view class="genderbox">
        <view class="boxheader">
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #030303" @click="$refs.mainsubjectgrade.close()">取消</view>
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #3553e8" @click="maingradeok">完成</view>
        </view>
        <picker-view indicator-style="height: 50px;" style="height: 400rpx" :value="value" @change="maingrades">
          <picker-view-column>
            <view v-for="(item, index) in maingrade" :key="index" style="text-align: center; line-height: 100rpx">
              {{ item.name }}
            </view>
          </picker-view-column>
        </picker-view>
      </view>
    </uni-popup>
    <!-- 辅教科目选择 -->
    <uni-popup ref="fujiaokemu" type="bottom">
      <view class="genderbox">
        <view class="boxheader">
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #030303" @click="$refs.fujiaokemu.close()">取消</view>
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #3553e8" @click="fusubjectok">完成</view>
        </view>
        <picker-view indicator-style="height: 50px;" style="height: 400rpx" :value="value" @change="fusubject">
          <picker-view-column>
            <view v-for="(item, index) in fujiaokemulist" :key="index" style="text-align: center; line-height: 100rpx">
              {{ item.name }}
            </view>
          </picker-view-column>
        </picker-view>
      </view>
    </uni-popup>
    <!-- 辅教年级选择 -->
    <uni-popup ref="fujiaonianji" type="bottom">
      <view class="genderbox">
        <view class="boxheader">
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #030303" @click="$refs.fujiaonianji.close()">取消</view>
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #3553e8" @click="fugradeok">完成</view>
        </view>
        <picker-view indicator-style="height: 50px;" style="height: 400rpx" :value="value" @change="fugrade">
          <picker-view-column>
            <view v-for="(item, index) in fujiaonianij" :key="index" style="text-align: center; line-height: 100rpx">
              {{ item.name }}
            </view>
          </picker-view-column>
        </picker-view>
      </view>
    </uni-popup>
    <!-- 身份选择 -->
    <uni-popup ref="sf" type="bottom">
      <view class="genderbox">
        <view class="boxheader">
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #030303" @click="$refs.sf.close()">取消</view>
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #3553e8" @click="sfok">完成</view>
        </view>
        <picker-view indicator-style="height: 50px;" style="height: 400rpx" :value="value" @change="sfchange">
          <picker-view-column>
            <view v-for="(item, index) in sf" :key="item.id" style="text-align: center; line-height: 100rpx">
              {{ item.name }}
            </view>
          </picker-view-column>
        </picker-view>
      </view>
    </uni-popup>
    <!-- 性别选择 -->
    <uni-popup ref="gender" type="bottom">
      <view class="genderbox">
        <view class="boxheader">
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #030303" @click="$refs.gender.close()">取消</view>
          <view style="font-family: PingFang SC, PingFang SC; font-weight: bold; color: #3553e8" @click="genderok">完成</view>
        </view>
        <picker-view indicator-style="height: 50px;" style="height: 400rpx" :value="value" @change="genderchange">
          <picker-view-column>
            <view v-for="(item, index) in genderlist" :key="item.id" style="text-align: center; line-height: 100rpx">
              {{ item.name }}
            </view>
          </picker-view-column>
        </picker-view>
      </view>
    </uni-popup>
    <view :style="{ height: Height + 'px' }"></view>
  </view>
</template>

<script>
import { qqmap } from '@/utils/qqmap.js';
export default {
  data() {
    const currentDate = this.getDate({
      format: true
    });
    return {
      Height: '', // 键盘的高度s
      imgUrl: '', // 图片的基地址
      value: [0],
      agree: false,
      showfujiao: false, // 是否展示辅教科目
      teaching: [
        {
          teaching_start: '',
          teaching_end: '',
          teaching_title: '',
          teaching_career: ''
        }
      ], // 教学经历
      case_title: '', //成果标题
      case_content: '', // 成果内容
      honors: '', // 荣誉奖励
      mobile: '', // 手机号
      name: '', //姓名
      teaching_len: '', // 年龄
      address: '', // 地址
      lat_t: '',
      lon_t: '',
      card_front: '', // 身份证正面
      card_side: '', // 身份证反面
      diploma: '', //学生证、毕业证
      certification: '', // 教师资格证
      duty_pic: '', //职称证书
      duty_name: '', // 职称
      person_pic: '', //个人照片
      video: '', // 视频
      identity_role: '', // 身份id
      card_num: '', // 身份证
      grade_id: '', // 主教年级
      subject_id: '', // 主教科目
      mainsubjectlist: [], // 主教科目列表
      maingrade: [], // 主教年级列表
      assist_grade_id: '', // 辅教年级
      assist_subject_id: '', // 辅教科目s
      fujiaokemulist: [], // 辅教科目列表
      fujiaonianij: [], // 辅教年级列表
      miansubjectname: '', // 主教科目名字
      fusubjectname: '', // 辅教科目名字
      maingradename: '', //主教年级名字
      fugradename: '', // 辅教科目名字
      mainsubjectindex: '', // 主教科目索引
      fusubjectindex: '', // 辅教科目索引
      maingradeindex: '', // 主教年级索引
      fugradeindex: '', //辅教年级索引
      sfname: '', // 身份名字
      sfindex: '', // 身份索引
      genderindex: '', //性别索引
      gendername: '', // 性别名字
      genderlist: [
        { id: 1, name: '女' },
        {
          id: 2,
          name: '男'
        }
      ], //性别
      sf: [] // 身份列表
    };
  },
  methods: {
    // // 获取输入框的高度
    // getHeight(e) {
    //   console.log(e, '输入框的高度');
    // },
    // 跳转到教师协议
    gojiedanxy() {
      uni.navigateTo({
        url: '/pages/jsjdxy/jsjdxy'
      });
    },
    // 跳转到教师入住协议
    goruzhuxy() {
      uni.navigateTo({
        url: '/pages/jsrzxy/jsrzxy'
      });
    },
    //教师认证
    async rzteacher() {
      if (!/^1[3-9][0-9]{9}$/.test(this.mobile)) {
        return uni.showToast({
          title: '输入的手机号不正确',
          icon: 'none'
        });
      }
      if (this.card_front == '' || this.card_side == '') {
        return uni.showToast({
          title: '请上传身份证照片',
          icon: 'none'
        });
      }
      if (this.name == '') {
        return uni.showToast({
          title: '请输入姓名',
          icon: 'none'
        });
      }
      if (!/^\d{18}$/.test(this.card_num)) {
        return uni.showToast({
          title: '输入的身份证不正确',
          icon: 'none'
        });
      }
      if (this.teaching_len == '') {
        return uni.showToast({
          title: '请输入教龄',
          icon: 'none'
        });
      }
      if (this.address == '') {
        return uni.showToast({
          title: '请输入详细地址',
          icon: 'none'
        });
      }
      if (this.person_pic == '') {
        return uni.showToast({
          title: '请上传个人照片',
          icon: 'none'
        });
      }
      // if (this.video == '') {
      //   return uni.showToast({
      //     title: '请上传个人视频',
      //     icon: 'none'
      //   });
      // }
      if (!this.agree) {
        return uni.showToast({
          title: '请先阅读教师接单协议和教师入住协议',
          icon: 'none'
        });
      }
      const res = await uni.$http.post('/teacher/add', {
        mobile: this.mobile,
        card_front: this.card_front,
        card_side: this.card_side,
        name: this.name,
        gender: this.gender,
        card_num: this.card_num,
        identity_role: this.identity_role,
        diploma: this.diploma,
        certification: this.certification,
        teaching_len: this.teaching_len,
        duty_name: this.duty_name,
        duty_pic: this.duty_pic,
        person_pic: this.person_pic,
        video: this.video,
        grade_id: this.grade_id,
        subject_id: this.subject_id,
        assist_grade_id: this.assist_grade_id,
        assist_subject_id: this.assist_subject_id,
        honors: this.honors,
        case_title: this.case_title,
        teaching: JSON.stringify(this.teaching),
        address: this.address,
        lat_t: this.lat_t,
        lon_t: this.lon_t
      });
      console.log('认证后的结果', res);
      if (res.data.code == 1) {
        uni.redirectTo({
          url: '/pages/daishenhe/daishenhe'
        });
      } else {
        uni.showToast({
          title: '认证信息有误，请修改后重新提交审核',
          icon: 'none'
        });
      }
    },
    // 获取地址的经纬度
    getlat() {
      let url = `https://apis.map.qq.com/ws/geocoder/v1/?address=`;
      this.$jsonp(url, {
        key: '5ZKBZ-M5CCV-M4EP2-5JRNX-KCZBQ-MCFA4',
        address: this.address,
        output: 'jsonp'
      }).then((res) => {
        console.log(res, '地址解析');
        this.lon_t = res.result.location.lng;
        this.lat_t = res.result.location.lat;
      });
      // qqmap.geocoder({
      //   address: this.address,
      //   success: (res) => {
      //     console.log(res);
      //     this.lon_t = res.result.location.lng;
      //     this.lat_t = res.result.location.lat;
      //   }
      // });
    },
    // 上传图片
    upload(type) {
      uni.chooseMedia({
        count: 1,
        mediaType: ['image', 'video'],
        sourceType: ['album', 'camera'],
        sizeType: ['original', 'compressed'],
        success: (res) => {
          console.log(res.tempFiles);
          uni.uploadFile({
            url: this.upimg + '/api/common/upload',
            filePath: res.tempFiles[0].tempFilePath,
            name: 'file',
            formData: {
              token: uni.getStorageSync('token')
            },
            success: (res2) => {
              console.log(JSON.parse(res2.data));
              const data = JSON.parse(res2.data).data;
              if (type == 1) {
                this.card_front = data.url;
              } else if (type == 2) {
                this.card_side = data.url;
              } else if (type == 3) {
                this.diploma = data.url;
              } else if (type == 4) {
                this.certification = data.url;
              } else if (type == 5) {
                this.duty_pic = data.url;
              } else if (type == 6) {
                this.person_pic = data.url;
              } else if (type == 7) {
                this.video = data.url;
              }
            }
          });
        }
      });
    },
    // 获取科目列表
    async getsubjectlist() {
      const res = await uni.$http.post('/index/subjectList', {
        name: ''
      });
      console.log('科目列表', res.data.data.list);
      this.mainsubjectlist = res.data.data.list;
      this.fujiaokemulist = res.data.data.list;
    },
    // 获取年级列表
    async getgradelist() {
      const res = await uni.$http.post('/index/gradeList', {
        name: ''
      });
      console.log('年级列表', res.data.data.list);
      this.maingrade = res.data.data.list;
      this.fujiaonianij = res.data.data.list;
    },
    // 获取身份列表
    async getsflist() {
      const res = await uni.$http.post('/index/list', {
        status: '1'
      });
      this.sf = res.data.data;
      console.log('获取身份列表', res.data.data);
    },
    // 删除此经历
    delexperence(index) {
      if (this.teaching.length == 1) {
        return;
      } else {
        this.teaching.splice(index, 1);
      }
    },
    //开始时间改变切换
    bindDateChange: function (e, index) {
      this.teaching[index].teaching_start = e.detail.value;
    },
    // 结束时间改变切换
    bindDateChangeend(e, index) {
      this.teaching[index].teaching_end = e.detail.value;
    },
    //  获取时间
    getDate(type) {
      const date = new Date();
      let year = date.getFullYear();
      let month = date.getMonth() + 1;
      let day = date.getDate();

      if (type === 'start') {
        year = year - 60;
      } else if (type === 'end') {
        year = year + 2;
      }
      month = month > 9 ? month : '0' + month;
      day = day > 9 ? day : '0' + day;
      return `${year}-${month}-${day}`;
    },
    // 主教科目切换
    mainsubject(e) {
      // console.log('主教科目切换', e.detail.value[0]);
      this.mainsubjectindex = e.detail.value[0];
      this.miansubjectname = this.mainsubjectlist[e.detail.value[0]].name;
      this.subject_id = this.mainsubjectlist[e.detail.value[0]].id;
    },
    // 主教年级切换
    maingrades(e) {
      // console.log('主教年级选择', e.detail.value[0]);
      this.maingradeindex = e.detail.value[0];
      this.maingradename = this.maingrade[e.detail.value[0]].name;
    },
    // 主教科目点击完成
    minsubjectok() {
      if (!this.mainsubjectindex) {
        this.subject_id = this.mainsubjectlist[0].id;
        this.miansubjectname = this.mainsubjectlist[0].name;
      } else {
        this.subject_id = this.mainsubjectlist[this.mainsubjectindex].id;
      }
      this.$refs.mainsubject.close();
      console.log('主教科目索引', this.mainsubjectindex, '主教科目id', this.subject_id);
    },
    //  主教年级点击完成
    maingradeok() {
      if (!this.maingradeindex) {
        this.grade_id = this.maingrade[0].id;
        this.maingradename = this.maingrade[0].name;
      } else {
        this.grade_id = this.maingrade[this.maingradeindex].id;
      }
      this.$refs.mainsubjectgrade.close();
      console.log('副教科目索引', this.maingradeindex, '副教科目id', this.grade_id);
    },
    // 辅教科目切换
    fusubject(e) {
      // console.log('辅教科目切换', e.detail.value[0]);
      this.fusubjectname = this.fujiaokemulist[e.detail.value[0]].name;
      this.fusubjectindex = e.detail.value[0];
    },
    // 辅教年级切换
    fugrade(e) {
      // console.log('辅教年级切换', e.detail.value[0]);
      this.fugradename = this.fujiaonianij[e.detail.value[0]].name;
      this.fugradeindex = e.detail.value[0];
    },
    // 辅教年级点击完成
    fugradeok() {
      if (!this.fugradeindex) {
        this.assist_grade_id = this.fujiaonianij[0].id;
        this.fugradename = this.fujiaonianij[0].name;
      } else {
        this.assist_grade_id = this.fujiaonianij[this.fugradeindex].id;
      }
      this.$refs.fujiaonianji.close();
      console.log('辅教年级索引', this.fugradeindex, '辅教年级id', this.assist_grade_id);
    },
    // 辅教科目点击完成
    fusubjectok() {
      if (!this.fusubjectindex) {
        this.assist_subject_id = this.fujiaokemulist[0].id;
        this.fusubjectname = this.fujiaokemulist[0].name;
      } else {
        this.assist_subject_id = this.fujiaokemulist[this.fusubjectindex].id;
      }
      this.$refs.fujiaokemu.close();
      console.log('辅教科目索引', this.fusubjectindex, '辅教科目id', this.assist_subject_id);
    },
    // 身份切换
    sfchange(e) {
      console.log(e.detail.value);
      this.sfindex = e.detail.value[0];
      this.sfname = this.sf[this.sfindex].name;
    },
    // 点击身份完成
    sfok() {
      if (!this.sfindex) {
        this.identity_role = this.sf[0].id;
        this.sfname = this.sf[0].name;
      } else {
        this.identity_role = this.sf[this.sfindex].id;
      }
      this.$refs.sf.close();
    },
    // 性别切换
    genderchange(e) {
      this.genderindex = e.detail.value[0];
      this.gendername = this.genderlist[e.detail.value[0]].name;
    },
    // 点击性别完成
    genderok() {
      if (!this.genderindex) {
        this.gender = this.genderlist[0].id;
        this.gendername = this.genderlist[0].name;
      } else {
        this.gsender = this.genderlist[this.genderindex].id;
      }
      this.$refs.gender.close();
    }
  },
  onLoad() {
    // 配置图片的基地址
    this.imgUrl = this.imgurl;
    // 获取科目列表
    this.getsubjectlist();
    // 获取年级列表
    this.getgradelist();
    // 获取身份列表
    this.getsflist();
  },
  computed: {
    startDate() {
      return this.getDate('start');
    },
    endDate() {
      return this.getDate('end');
    }
  },
  onShow() {
    uni.onKeyboardHeightChange((res) => {
      console.log(res, '键盘的高度');
      this.Height = res.height;
    });
  }
};
</script>

<style lang="scss" scoped>
input {
  color: #000s;
}
.container {
  box-sizing: border-box;
  .experience {
    box-sizing: border-box;
    padding: 30rpx 54rpx;
    .time {
      box-sizing: border-box;
      width: 640rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      .starttime {
        box-sizing: border-box;
        width: 256rpx;
        height: 66rpx;
        text-align: center;
        line-height: 66rpx;
        background: #f9f9f9;
        border-radius: 10rpx 10rpx 10rpx 10rpx;
        font-weight: 500;
        font-size: 24rpx;
        color: #333333;
      }
      .endtime {
        box-sizing: border-box;
        width: 256rpx;
        height: 66rpx;
        text-align: center;
        line-height: 66rpx;
        background: #f9f9f9;
        border-radius: 10rpx 10rpx 10rpx 10rpx;
        font-weight: 500;
        font-size: 24rpx;
        color: #333333;
      }
    }
    .title {
      box-sizing: border-box;
      width: 640rpx;
      height: 84rpx;
      margin-top: 40rpx;
      background: #f9f9f9;
      border-radius: 10rpx 10rpx 10rpx 10rpx;
      border: 2rpx solid #f1f1f1;
      .titlebox {
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 20rpx;
      }
    }
    .content {
      box-sizing: border-box;
      width: 640rpx;
      height: 202rpx;
      padding: 20rpx;
      background: #f9f9f9;
      font-weight: 500;
      font-size: 24rpx;
      color: #999999;
    }
  }
  .swichfujiao {
    box-sizing: border-box;
    width: 750rpx;
    height: 120rpx;
    text-align: center;
    line-height: 120rpx;
    font-weight: 500;
    font-size: 28rpx;
    color: #3553e8;
    background: #ffffff;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
  }
  background-color: #fff;
  .phone {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 750rpx;
    height: 120rpx;
    padding: 40rpx;
    background: #ffffff;
    font-size: 28rpx;
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
  }
  .cardfront {
    box-sizing: border-box;
    width: 750rpx;
    height: 300rpx;
    padding: 40rpx;
    background: #ffffff;
  }
  .submit {
    box-sizing: border-box;
    width: 670rpx;
    height: 90rpx;
    text-align: center;
    line-height: 90rpx;
    color: #fff;
    margin-top: 88rpx;
    margin-left: 40rpx;
    background: #3553e8;

    border-radius: 100rpx 100rpx 100rpx 100rpx;
  }
  .oktitle {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 640rpx;
    height: 84rpx;
    margin: 0 54rpx;
    padding: 20rpx;
    background: #f9f9f9;
    border-radius: 10rpx 10rpx 10rpx 10rpx;
    border: 2rpx solid #f1f1f1;
  }
  .content2 {
    box-sizing: border-box;
    width: 640rpx;
    height: 202rpx;
    padding: 20rpx;
    margin: 0 54rpx;
    background: #f9f9f9;
    font-weight: 500;
    font-size: 24rpx;
    color: #999999;
  }
  .rongyu {
    box-sizing: border-box;
    width: 640rpx;
    height: 202rpx;
    padding: 20rpx;
    margin-top: 20rpx;
    background: #f9f9f9;
    font-weight: 500;
    font-size: 24rpx;
    color: #999999;
    margin-left: 20rpx;
  }
  .genderbox {
    box-sizing: border-box;
    width: 750rpx;
    height: 560rpx;
    padding: 40rpx;
    font-size: 28rpx;
    background: #fff;
    border-radius: 30rpx 30rpx 0rpx 0rpx;
    .boxheader {
      display: flex;
      justify-content: space-between;
    }
  }
}
</style>